<template>
	<view class="hui b_width">
		<view class="info_box">
			<view class="box" @click="$project.toPath('/pages/address/list?type=2')">
				<view class="a_box b_flex_c">
					<image src="@/static/img/shoplistadd.png" class="a_img"></image>
					<view class="a_info" v-if="!address.id">
						<view>请先添加收货地址</view>
					</view>
					<view class="a_info" v-else>
						<view>{{address.province}}{{address.city}}{{address.district}}{{address.detail}}</view>
						<view class="a_name">
							<text class="name">{{address.realName}}</text>
							<text>{{address.phone}}</text>
						</view>
					</view>
					<image src="@/static/img/my/right.png" class="jg_icon"></image>
				</view>
			</view>

			<view class="box">
				
				<view class="b_flex_c ginfo_box" v-for="(item,index) in info.orderInfoVo.orderDetailList">
					<image :src="item.image" class="iimg"></image>
					<view class="g_center">
						<view class="i_name">{{item.productName}}</view>
						<view class="i_num">¥{{item.price}}<text v-if="item.unitName">/{{item.unitName}}</text></view>
						<view>x{{item.payNum}}</view>
					</view>
					<view class="prices">¥{{item.payNum*Number(item.price)}}</view>
				</view>
				
				<view class="b_flex">
					
					<view class="i_left">
						<view class="i_name">{{info.name}}</view>
						<view class="i_num">{{info.skus.name}}</view>
						<view class="i_num">x1</view>
					</view>
				</view>
				<view class="b_flex_c_s i_box">
					<view>单价</view>
					<view class="jf_box b_red">
						<span>{{info.skus.jb}}</span>
<!-- 						<span class="jf">金币</span> -->
					</view>
				</view>
				<view class="h_box b_flex_c_s_end">
					<text class="hj">合计:</text>
					<view class="jf_box b_red b_flex_c">
						<span>{{info.skus.jb}}</span>
						<!-- <span class="jf">金币</span> -->
					</view>
					</view>
			</view>
		</view>
		<!-- <view class="bottom_box" @click="submit">
			提交订单
		</view> -->
	</view>
</template>

<script>
	import {
		alist,
		ginfo,
		gdui,
		jyOrder,
		addressDefault
	} from '@/require/api.js';
	export default {
		components: {},
		data() {
			return {
				params: {
					preOrderNo: '',
				},
				address: {},
				info: {},
				form:{
					id:'',
					num:'',
					sku_id:'',
				}
			};
		},
		onShow() {
		
			this.getAddress();
		
		},
		onLoad(data) {
			if (data.preOrderNo) {
				this.params.preOrderNo = data.preOrderNo;
			}
			this.getInfo();
		},
		methods: {
			async submit(){
				let _=this;
				_.form.address_id=this.address.id;
				uni.showModal({
					title: '确定要提交订单吗?',
					success(res) {
						if (res.confirm) {
							gdui(_.form).then(ress=>{
								 
								 if(ress.code==200){
									_.$project.toast(ress.msg);
									setTimeout(()=>{
										_.$project.toBack();
									},1500);
								 }
								 
							});
						}
					}
				})
			},
			async getInfo() {
				let {
					data
				} = await jyOrder(this.params);
				this.info = data;
			},
			async getAddress() {
				let address = getApp().globalData.address;
				if (address.id) {
					this.address = address;
				} else {
					let {
						data
					} = await addressDefault();
					this.address = data;
				}
			}
		}
		
	}
</script>

<style lang="scss" scoped>
	.info_box {
		box-sizing: border-box;
		padding: 30rpx;
	}

	.box {
		box-sizing: border-box;
		padding: 25rpx;
		background-color: #FFFFFF;
		border-radius: 10rpx;
		margin-bottom: 30rpx;
	}

	.a_box {
		border-bottom: 4rpx dashed #eee;
		box-sizing: border-box;
		padding: 0 0 30rpx 0;
		font-size: 28rpx;
		font-weight: 500;
	}

	.a_info {
		width: 540rpx;
	}

	.a_img {
		width: 50rpx;
		height: 58rpx;
		margin-right: 20rpx;
	}

	.a_name {
		font-size: 26rpx;
		margin-top: 8rpx;
	}

	.name {
		margin-right: 20rpx;
	}

	.jg_icon {
		width: 13rpx;
		height: 23rpx;
		margin-left: auto;
	}

       .ginfo_box{
		   margin-bottom: 30rpx;
	   }

	.iimg {
		width: 180rpx;
		height: 180rpx;
		border-radius: 25rpx;
		margin-right: 20rpx;
	}
	
	.g_center{
		width: 50%;
		font-size: 22rpx;
		color: #999;
	}

	.i_name {
	    color: black;
		font-size: 28rpx;
	}

	.i_num {
		margin: 15rpx 0;
	}
	.prices{
		margin-left: auto;
	}
	.i_box{
		box-sizing: border-box;
		padding: 25rpx 0;
		border-bottom: 1rpx solid #eee;
	}
	.h_box{
		margin-top: 20rpx;
		text-align: right;
	}
	.hj{
		font-size: 24rpx;
		margin-right: 20rpx;
	}
	.bottom_box{
		box-sizing: border-box;
		padding: 20rpx 20rpx;
		position: fixed;
		left: 10%;
		bottom: 50rpx;
		background-color:#FF4E1B ;
		width: 80%;
		color: #FFFFFF;
		text-align: center;
		border-radius: 30rpx;
	}
	.i_left{
		width: 62%;
	}
	.jf_box {
		font-size: 30rpx;
		font-weight: bold;
	
	}
	
	.jf {
		margin-left: 5rpx;
		font-size: 22rpx;
	}
</style>